<template>
	<view class="page_jc">
		<view class="page_jc_header">
			<view class="header_content">
				<view class="left">
					<text class="title">市场进场预登记</text>
					<view class="divLine"></view>
					<text class="sub_title">提前登记 快速审核 高效入场</text>
				</view>
				<view class="header_image">
					<image src="/static/right.png"></image>
				</view>
			</view>
		</view>
		<view class="page_jc_content">
			<view class="select_type">
				<text class="title">选择品类</text>
			</view>
			<view class="page_content" @click="togs">
				<view class="page_image">
					<image src="/static/gs.png"></image>
				</view>
				<view class="left">
					<text class="title">果蔬</text>
				</view>
			</view>
			<view class="page_content">
				<view class="page_image">
					<image src="/static/rp.png"></image>
				</view>
				<view class="left">
					<text class="title">肉类冻品</text>
				</view>
			</view>
		</view>
	</view>
</template>
<script>  
		var util = require('../../../common/util.js');  //require这个js模块  
		var formatedPlayTime = util.formatTime(playTime); //调用js模块的方法  
</script>
<script>
	export default {
		data() {
			return {
				
			}
		},
		onLoad() {

		},
		methods: {
			togs(event){
				//`event` 是原生 DOM 事件
				console.log(event);
				uni.navigateTo({
					url:'../gs/gs-step1',
					animationType: 'pop-in',
					animationDuration: 200
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		width: 100%;
		background-color: #f0f0f0;
	}

	.page_jc_header {
		padding-top: 10px;
		background-color: #3cb371;
		background-image: none!important;
		width: 100%;
		height: 28vh;

		.header_content {
			display: flex;
			flex-direction: row;

			.header_image{
				display: flex;
				flex-direction: column;
				width: 38vh;
				margin-top: 50px;
				margin-left: 20px;
				
				image{
					width: 94px;
					height: 94px;
				}
			}

			.left {
				display: flex;
				flex-direction: column;
				width: 45vh;
				margin-top: 5vh;
				margin-left: 20px;

				.title {
					width: 24vh;
					font-size: 48rpx;
					font-weight: bold;
					color: rgba(255, 255, 255, 1);
				}

				.sub_title {
					margin-top: 20px;
					font-size: 15px;
					color: rgba(255, 255, 255, 1);
				}
				
				/*分割线样式*/
				.divLine{
				 margin-top: 15px;
				 background: #E0E3DA;
				 width: 90%;
				 height: 1rpx;
				}
			}
		}
	}
	
	.page_jc_content{
		background-image: url(../../static/bj.png);
		background-size: 100%;
		opacity:0.8;
		.select_type{
			margin-left: 10px;
			margin-top: 5px;
			.title{
				font-size: 38rpx;
				font-weight: bold;
				color: rgba(16, 16, 16, 1);
			}
		}
		
		.page_content {
				display: flex;
				flex-direction: row;
				border: 5rpx solid #3cb371;
				border-radius: 10rpx;
				padding: 10rpx;
				margin-top: 40px;
				margin-left: 10px;
				margin-right: 10px;
		
		
				.page_image{
					margin-top: 20px;
					margin-left: 10px;
					margin-right: 75px;
					padding-bottom: 20px;
					
					image{
						width: 80px;
						height: 80px;
					}
				}
		
				.left {
					margin-top: 50px;
					margin-left: 10vh;
		
					.title {
						font-size: 38rpx;
						font-weight: bold;
						color: rgba(16, 16, 16, 1);
					}
				
		
					.btn {
						margin-top: 3px;
						width: realSize(198px);
						height: realSize(60px);
						background: linear-gradient(-30deg, rgba(252, 135, 29, 1), rgba(246, 185, 9, 1));
						box-shadow: 0px 4px 10px 0px rgba(255, 121, 0, 0.5);
						border-radius: realSize(30px);
						color: rgba(255, 255, 255, 1);
						display: flex;
						align-items: center;
						justify-content: center;
					}
				}
			}
	}
</style>
